<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>layui</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" href="/statics/layui/css/layui.css"  media="all">
</head>
<body>
 
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
  <legend>我的交易记录</legend>
</fieldset>
<div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
  <ul class="layui-tab-title">
    <li class="layui-this">买入记录</li>
    <li class="">卖出记录</li>
  </ul>
  <div class="layui-tab-content" style="height: 100px;">
    <div class="layui-tab-item layui-show">
        <table class="layui-hide" id="dg1" lay-filter="dg1"></table>
    </div>
    <div class="layui-tab-item">
        <table class="layui-hide" id="dg2" lay-filter="dg2"></table>
    </div>
  </div>
</div>
<script type="text/html" id="bar2">
  {{#  if(d.status == 0){ }}
    <a class="layui-btn layui-btn-xs" lay-event="cell">撤销</a>
  {{#  } else { }}
    <a class="layui-btn layui-btn-xs layui-btn-disabled">撤销</a>
  {{#  } }}  
</script>

<script src="/statics/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="../js/config.js"></script>
<script type="text/javascript" src="../js/utils.js"></script>
<script>
layui.use(['table','element'], function(){
  var table = layui.table, element = layui.element;
  
  table.render({
    elem: '#dg1'
    ,url: Config.WEB_SERVER_API + Config.URI.USER_MONEY_BUY_LIST,
    request: {
      pageName: 'offset' //页码的参数名称，默认：page
      ,limitName: 'limit' //每页数据量的参数名，默认：limit
    },
    cellMinWidth: 80, //全局定义常规单元格的最小宽度，layui 2.2.1 新增
    cols: [[
      {field:'id', title: 'ID', hide: true}
      ,{field:'typeName', title: '币种'}
      ,{field:'money', title: '数量'}
      ,{field:'brokeMoney', title: '手续费'}      
      ,{field:'createTime', title: '买入时间', templet: function(d){return FormatUtils.parseTimestampToDateTime(d.createTime);}}
    ]]
    ,page: true, loading: true,
    response: {
      statusCode: "200" //重新规定成功的状态码为 200，table 组件默认为 0
    },
    parseData: function(res){ //将原始数据解析成 table 组件所规定的数据
      return {
        "code": parseInt(res.resultCode), //解析接口状态
        "msg": res.resultMsg, //解析提示文本
        "count": res.total, //解析数据长度
        "data": res.rows //解析数据列表
      };
    }
  });

  table.render({
    elem: '#dg2'
    ,url: Config.WEB_SERVER_API + Config.URI.USER_MONEY_SELL_LIST,
    request: {
      pageName: 'offset' //页码的参数名称，默认：page
      ,limitName: 'limit' //每页数据量的参数名，默认：limit
    },
    cellMinWidth: 80, //全局定义常规单元格的最小宽度，layui 2.2.1 新增
    cols: [[
      {field:'id', title: 'ID', hide: true}
      ,{field:'typeName', title: '币种', width:100}
      ,{field:'money', title: '数量', width:100}
      ,{field:'leaveMoney', title: '余额', width:100}
      ,{field:'buyTypeName', title: '接受币种', width:100}
      ,{field:'statusName', title: '状态', width:100}
      ,{field:'createTime', title: '提交时间', templet: function(d){return FormatUtils.parseTimestampToDateTime(d.createTime);}}          
      ,{ fixed: 'right', title: '操作', toolbar: '#bar2', width: 150 }
    ]]
    ,page: true, loading: true,
    response: {
      statusCode: "200" //重新规定成功的状态码为 200，table 组件默认为 0
    },
    parseData: function(res){ //将原始数据解析成 table 组件所规定的数据
      return {
        "code": parseInt(res.resultCode), //解析接口状态
        "msg": res.resultMsg, //解析提示文本
        "count": res.total, //解析数据长度
        "data": res.rows //解析数据列表
      };
    }
  });

  //监听行工具事件
  table.on('tool(dg2)', function (obj) {
    var data = obj.data;
    if (obj.event === 'cell') {
      layer.confirm('确定要撤销卖单吗?', {icon: 3, title:'提示'}, function(index){
        layer.close(index);
        layer.load(1);
        DataUtils.cancelUserMoneySell(data, function(result){
          layer.closeAll();
          table.reload("#dg2", {});          
        })
      });
    }
  });


});

</script>

</body>
</html>